import { createApp } from "vue";
import App from "./App.vue";

import VueVideoPlayer from "@videojs-player/vue";
import "video.js/dist/video-js.css";
import highlight from "highlight.js";
import "highlight.js/styles/atom-one-dark.css";
import "normalize.css/normalize.css";
import "element-plus/theme-chalk/dark/css-vars.css";
// import "element-plus/dist/index.css";
import { createPinia } from "pinia";
//SVG导入
import "virtual:svg-icons-register";

import "@/assets/styles/color.scss";

//注册多个全局组件
import gloablComponent from "./components/index";

// 全局组件挂载

import router from "@/router/index.ts";
const pinia = createPinia();
const app = createApp(App);
app.use(pinia);
app.use(VueVideoPlayer);
app.use(gloablComponent);
app.use(router);

// 配置Markdown语法高亮
app.directive("highlight", function (el) {
  let blocks = el.querySelectorAll("pre code");
  blocks.forEach((block) => {
    highlight.highlightBlock(block);
  });
});

app.mount("#app");
